<template>
  <div class="flx-s">
    <a-input class="w120 h40" v-model.trim="captcha"></a-input>
    <img class="cpt w120 h40 mr10" @click="search" :src="`data:image/png;base64,${base64}`" title="点击图片切换验证码"/>
    <a-button type="primary" class="h40" @click="validate">验证</a-button>
  </div>
</template>

<script>
export default {
  data () {
    return {
      sign: '',
      base64: '',
      captcha: ''
    }
  },
  mounted () {
    this.search()
  },
  methods: {
    search () {
      this.$http.get('zg-system/un/captcha/create', {}, data => {
        this.sign = data[0]
        this.base64 = data[1]
      })
    },
    validate () {
      this.$http.get('zg-system/un/captcha/validate', { sign: this.sign, captcha: this.captcha }, data => {
        alert(data)
      })
    }
  }
}
</script>
<style lang="less" scoped>
</style>
